import idUtil from "./IdUtil"

const modelId = '__model';

export default {
    alert: function (op) {
        let defOp = {
            content: '',
        };
        if (typeof op == 'string') {
            op = Object.assign({}, defOp, {content: op});
        } else {
            op = Object.assign({}, defOp, op);
        }
        if (window.layx) {
            layx.alert('系统提示', op.content);
        } else {
            alert(op.content);
        }
    },
    /**
     * 打开一个HTML窗口
     * @param id
     * @param dom
     * @param title
     * @param op
     */
    openHtml: function (id, title, dom, op) {
        let def = {
            width: 500,
            height: 500,
            minMenu: false,
            maxMenu: false,
            shadable: true,
            cloneElementContent: false,
            dragInTopToMax: false,
            statusBar: true,
            event: {
                ondestroy: {
                    after: function () {
                        $(dom).remove();
                    }
                }
            }, buttons: [{
                label: '确认',
                callback: function (id, bt, e) {
                    layx.destroy(id);
                }
            }, {
                label: '取消',
                callback: function (id, bt, e) {
                    layx.destroy(id);
                }
            }]
        };
        op = Object.assign({}, def, op);
        layx.html(id, title, dom, op);
    },

    showXTextDialog: (op) => {
        let opDef = {
            title: '请输入',
            tip: '请输入文本:',
            value:'',
            callback: function (res) {
            }
        };
        op = Object.assign({}, opDef, op);
        layx.prompt(op.title, op.tip,function (id, value, textarea, button, event) {
            op.callback(value);
        }, op.value);
    },
    /***
     * 显示提示框
     * @param op
     */
    showXTipDialog: (op) => {
        let opDef = {
            title: '系统提示', //头部标语
            tip: '请输入文本:', //内容
            width: 400,
            height: 155,
            callback: function () { //未传btns时调用此处回调
            }
        };
        op = Object.assign({}, opDef, op);
        layx.confirm(op.title, op.tip, function (id) {
            op.callback();
            layx.destroy(id);
        });
    },
    showXNumberDialog: (op) => {
        let opDef = {
            title: '请输入',
            tip: '请输入值:',
            isNumber: true,
            callback: function (res) {
            }
        };
        op = Object.assign({}, opDef, op);
        let id = idUtil.uuid();
        createUI(id, op);
        this.openHtml(id, op.title, document.getElementById(id), {
            height: 100,
            event: {
                ondestroy: {
                    after: function () {
                        destroyUI();
                    }
                }
            },
            buttons: [{
                label: '确认',
                callback: function (id, bt, e) {
                    let val = $('#' + id + ' input').val();
                    if (val) {
                        op.isNumber && (val = parseFloat(val))
                        op.callback(val);
                        layx.destroy(id);

                    } else {
                        util.alert('输入框不能为空!');
                    }
                }
            }, {
                label: '取消',
                callback: function (id, bt, e) {
                    layx.destroy(id);
                }
            }]
        });
        $('#XNumberDialoginput').focus();

        function destroyUI() {
            setTimeout(() => {
                $('#' + id).remove();
            }, 100);
        }

        function createUI(id, op) {
            let $warp = $('<div style="width: 100%;height: 100%;"></div>');
            $warp.attr('id', id);
            $warp.addClass('inputsWindow');
            let $input = $('<div class="item">\n' +
                '    <span id="tip" class="title" style="flex: 1;text-align: left">' + op.tip + '</span>\n' +
                '</div>\n' +
                '<div class="item content">\n' +
                '    <input type="text"\n' +
                '           ondragenter="return false"\n' +
                (op.isNumber ? '           onkeyup="this.value=this.value.replace(/[^\\d]/g,&#39;&#39;) "\n' : '') +
                (op.isNumber ? '           onafterpaste="this.value=this.value.replace(/[^\\d]/g,&#39;&#39;) "\n' : '') +
                '           id="XNumberDialoginput"/>\n' +
                '</div>');
            $warp.append($input);
            $('body').append($warp);
        }
    },
    showXInputsDialog: (op) => {
        let opDef = {
            title: '请输入',
            width: 400,
            height: 155,
            closable: true,
            inputs: [
                /*{
                                title: '姓名',
                                name: 'cs',
                                type: 'text',
                                value: '',
                                placeholder: '提示语',
                                disabled: false,
                                isNull: false
                            }, {
                                title: '年龄',
                                name: 'cs',
                                type: 'text',
                                isNull: false
                            }, {
                                title: '爱好',
                                name: 'cs',
                                type: 'checkbox',
                                isNull: false
                            }, {
                                title: '选择带回',
                                name: 'cs',
                                type: 'selectback',
                                sbParam: {
                                    //必填项
                                    showColNameStr: null,//必填    显示列的列名 eg:userName 多个用;隔开
                                    showColLableStr: null,//显示列的中文名  eg:用户名 多个用;隔开
                                    backColStr: null,//必填    带回列的列名 eg:userId  多个用;隔开
                                    backShow: '',//带回以后显示的列
                                    backHidden: '',//带回以后隐藏的列

                                    //访问路径 与 sql 二选一
                                    url: null,//程序访问路径
                                    sql: null,//sql语句 如有可变参数,无需写在sql中 在paramData中  参数名：参数值 即可
                                    data: null,//直接传数据

                                    //选填项
                                    getShowValue: false,//是否获取显示的列  为true时作为带c字段带回
                                    paramData: {},//参数和值的对象
                                    orderBy: {},//sql排序 eg:{aaaa001:'asc',aaaa002:'desc'}
                                    colWidthObj: {},//列宽默认100px 不为100px的在本对象中说明  格式： 列名:列宽 eg:{aaad005 :150,aaad006:219}
                                    multiSelect: false,//是否可多选
                                    width: 400,//选择带回框的宽
                                    height: 500,//选择带回框的高

                                    //用于修改时给选择带回框赋值
                                    showValue: '',//显示值
                                    hiddenValue: '',//隐藏值
                                },
                                isNull: false
                            }, {
                                title: '密码',
                                name: 'cs',
                                type: 'password',
                                isNull: false
                            }, {
                                name: 'aaae000',
                                type: 'hidden',
                                value: '',
                                isNull: false
                            }*/
            ],
            callback: function (res) {
            }
        };
        op = Object.assign({}, opDef, op);
        let id = idUtil.uuid();
        let winId = id + '_win';
        createWinUI(id, op.inputs);
        this.openHtml(winId, op.title, document.getElementById(id), {
            height: op.height,
            width: op.width,
            event: {
                ondestroy: {
                    after: function () {
                        destroyUI();
                    }
                }
            },
            buttons: [{
                label: '确认',
                callback: function (id, bt, e) {
                    submit() && (layx.destroy(id));
                }
            }, {
                label: '取消',
                callback: function (id, bt, e) {
                    layx.destroy(id);

                }
            }]
        });

        function submit() {
            let obj = {},
                isNull = false,
                isCallback = true;

            $('#' + id).find('.input').each(function () {
                let $this = $(this);
                let val = $this.val();
                if (val == '' && !$this.hasClass('isNull')) {
                    this.alert($this.data('title') + '不能为空');
                    isNull = true;
                    $this.focus();
                    isCallback = false;
                    return false;
                }
                obj[$this.attr('name')] = val;
            });
            $('.checkbox').each(function () {
                let $this = $(this);
                let isChecked = $this.hasClass('checked');
                obj[$this.attr('name')] = isChecked ? 1 : 0;
            });
            isCallback && op.callback(obj);
            return !isNull;

        }

        function destroyUI() {
            setTimeout(() => {
                $('#' + id).remove();
            }, 1000);
        }

        function createWinUI(id, inputs) {
            let $warp = $('<div style="width: 100%;height: 100%;"></div>');
            $warp.attr('id', id);
            $warp.addClass('inputsWindow');
            // <div class="item" style="display: none;">
            //         <label>姓名：</label>
            //     <input type="text" id="input"/>
            //         </div>
            let $item = $('<div class="item" >\n' +
                '        <label class="title">姓名：</label>\n' +
                '        <input type="text" class="input"/>\n' +
                '    </div>');
            for (let i in inputs) {
                let item = inputs[i];
                let $xItem = $item.clone();
                $xItem.find('.title').html(item.title + '：');
                if (item.type == 'checkbox') {
                    let checkbox = $('<div class="checkbox"><span></span></div>');
                    checkbox.attr('name', item.name);
                    if (item.value) {
                        checkbox.addClass('checked');
                    }
                    $xItem.find('.input').remove();
                    $xItem.append(checkbox);
                } else if (item.type == 'text') {
                    $xItem.find('.input').attr('name', item.name);
                    $xItem.find('.input').attr('value', item.value == undefined ? null : item.value);
                    if (item.disabled) {
                        $xItem.find('.input').attr('disabled', "disabled");
                    }
                    $xItem.find('.input').attr('placeholder', item.placeholder == undefined ? null : item.placeholder);
                    item.isNull && $xItem.find('.input').addClass('isNull');
                    $xItem.find('.input').data('title', item.title);
                } else if (item.type == 'password') {
                    $xItem.find('.input').attr('type', 'password');
                    $xItem.find('.input').attr('name', item.name);
                    $xItem.find('.input').attr('value', item.value == undefined ? null : item.value);
                    $xItem.find('.input').attr('placeholder', item.placeholder == undefined ? null : item.placeholder);
                    item.isNull && $xItem.find('.input').addClass('isNull');
                    $xItem.find('.input').data('title', item.title);
                } else if (item.type == 'selectback') { //选择带回
                    let selectBack = $(' <div class="bts"> ' +
                        '<input class="sb_show" id="' + item.name + '_show" type="text"> ' +
                        '<input class="sb_value input" type="hidden" name="' + item.name + '" id="' + item.name + '"> ' +
                        '<span class="sb_param" style="display:none" id="' + item.name + '_param">' + JSON.stringify(item.sbParam) +
                        '</span> ' +
                        '<i class="ico-close sb_clear" id="' + item.name + '_clear"></i> ' +
                        '<i class="ico-more sb_more" id="' + item.name + '_more"></i> </div>');
                    $xItem.find('.input').remove();
                    if (item.sbParam.getShowValue) { //带回显示值
                        selectBack.find('#' + item.name + '_show').attr('name', item.name + 'c');
                        selectBack.find('#' + item.name + '_show').addClass('input');
                    }
                    if (item.sbParam.showValue) { //设置显示值
                        selectBack.find('#' + item.name + '_show').val(item.sbParam.showValue);
                    }
                    if (item.sbParam.hiddenValue) { //设置隐藏值
                        selectBack.find('#' + item.name).val(item.sbParam.hiddenValue);
                    }
                    $xItem.append(selectBack);
                    $xItem.addClass('selectback');
                } else if (item.type == 'hidden') { //隐藏框
                    $xItem.find('.title').remove();
                    $xItem.find('.input').attr('type', 'hidden');
                    $xItem.find('.input').attr('name', item.name);
                    $xItem.find('.input').attr('value', item.value == undefined ? null : item.value);
                } else if (item.type == 'line') { //分割线
                    $xItem.html(item.title).css({
                        'border-bottom': 'solid 1px #2e2e2f',
                        'height': '0px',
                        'margin-bottom': '10px',
                        'margin-top': '10px',
                        'padding-left': '10px',
                        'font-size': '11px',
                        'justify-content': 'center',
                        'color': '#bbb',
                    });
                }
                $warp.append($xItem);
            }
            //单选框
            $warp.on('click', '.checkbox', function (e) {
                if ($(this).hasClass('checked')) {
                    $(this).removeClass('checked');
                } else {
                    $(this).addClass('checked');
                }
            });
            //选择带回的函数 将带回的数据填充到
            let sbFun = function (ele) {
                let id = ele.attr('id').substring(0, ele.attr('id').indexOf("_"));
                let paramJson = $('#' + id + '_param').text();
                let param = JSON.parse(paramJson);
                param.callback = (arr) => {
                    let showValue = '';
                    let hiddenValue = '';
                    for (let index in arr) {
                        showValue += arr[index][param.backShow] + ',';
                        hiddenValue += arr[index][param.backHidden] + ',';
                    }
                    if (showValue != '')
                        showValue = showValue.substring(0, showValue.length - 1);
                    if (hiddenValue != '')
                        hiddenValue = hiddenValue.substring(0, hiddenValue.length - 1);
                    $('#' + id + '_show').val(showValue);
                    $('#' + id + '_show').blur();
                    $('#' + id + '').val(hiddenValue);
                };
                dialogUtil.showXSelectBackDialog(param);
            };
            //选择带回框
            $warp.on('click', '.sb_show', function (e) {
                sbFun($(this));
            });
            //选择带回框
            $warp.on('click', '.sb_more', function (e) {
                sbFun($(this));
            });
            //选择带回清空
            $warp.on('click', '.sb_clear', function (e) {
                let id = $(this).attr('id').substring(0, $(this).attr('id').indexOf("_"));
                $warp.find('#' + id + '_show').val(null);
                $warp.find('#' + id + '').val(null);
            });
            $('body').append($warp);
        }
    },
}
